<template>
  <view v-if="itemNew.length" :style="'padding-top:'+mbConfig+'rpx;'">
    <view class='news acea-row row-between-wrapper' :style="'background:'+bgColor[0].item+';margin: 0 '+prConfig+'rpx;border-radius:'+bgStyle+'rpx'">
      <view class='pictrue'>
        <image :src='logoConfig'></image>
      </view>
      <view class='swiperTxt'>
        <view @click="goDetail(itemNew[0].chiild[1].val)" class='acea-row row-between-wrapper'>
          <view class='text acea-row row-between-wrapper'>
            <view class='newsTitle line1' :style="'text-align:'+ (txtStyle==1?'center':txtStyle==2?'right':'left') +';color:'+txtColor">{{itemNew[0].chiild[0].val}}</view>
          </view>
          <view class='iconfont icon-jiantou'></view>
        </view>
      </view>
    </view>
  </view>
</template>


<script>


import {merPath} from "@/utils/index"
export default {
  name: 'enter_store',
  props: {
    dataConfig: {
      type: Object,
      default: () => {}
    },
    merId: {
      type: String || Number,
      default: ''
    }
  },
  data() {
    return {
      indicatorDots: false,
      autoplay: true,
      duration: 500,
      itemNew: this.dataConfig.listConfig.list,
      logoConfig: this.dataConfig.logoConfig.url,
      bgColor: this.dataConfig.bgColor.color,
      mbConfig: this.dataConfig.mbConfig.val*2,
      prConfig: this.dataConfig.prConfig.val*2,
      txtStyle: this.dataConfig.txtStyle.type,
      txtColor: this.dataConfig.txtColor.color[0].item,
      bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
    };
  },
  created() {},
  mounted() {},
  methods: {
    goDetail(url){
      let urls = merPath(url, this.merId)
      this.$util.JumpPath(urls);
    }
  }
}
</script>

<style lang="scss" scoped>
.news {
  height: 140rpx;
  border-top: 1px solid #f4f4f4;
  padding: 0 20rpx;
  box-shadow: 0 10rpx 30rpx #f5f5f5;
}
.news .pictrue {
  width: 92rpx;
  height: 92rpx;
  border-right: 1px solid #ddd;
  padding-right: 23rpx;
  box-sizing: content-box;
}
.news .pictrue image {
  width: 100%;
  height: 100%;
}
.news .swiperTxt {
  width: 510rpx;
  height: 100%;
  line-height: 140rpx;
  overflow: hidden;
}
.news .swiperTxt .text {
  width: 480rpx;
}
.news .swiperTxt .text .label {
  font-size: 20rpx;
  color: #ff4c48;
  width: 64rpx;
  height: 30rpx;
  border-radius: 40rpx;
  text-align: center;
  line-height: 28rpx;
  border: 2rpx solid #ff4947;
}
.news .swiperTxt .text .newsTitle {
  width: 397rpx;
  font-size: 24rpx;
  color: #666;
}
.news .swiperTxt .iconfont {
  font-size: 22rpx;
  color: #282828;
}
.news .swiperTxt swiper {
  height: 100%;
}
</style>
